<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>JS复习</title>
</head>
<script type="text/javascript">
    var a = new Object();
    a.name = "zhangsan";

    //定义类
    function Person(){
        this.name = "abc";
        this.age = 18;
        this.play = function (){
            console.info("play");
        }
        this.eat = function (){
            alert("eat");
        }
    }

    var p = new Person();

    //动态创建
    var p1 = new Object();
    p1.name = "";
    p1.age = 18;
    p1.play = function(){
        console.info("play");
    }

    //JSON方式
    var p2 = {} //空对象   var p1 = new Object();
    var p3 = {

        name : "zhangsan",
        age : 18,
        play : function (){
            console.info("plau");
        },
        eat : ()=>{ //箭头函数
            alert("eat");
        }
    }

</script>
<body>
<button onclick="p.play();">玩</button>
<button onclick="p.eat();">吃</button>
<hr>
<button onclick="p3.play();">玩3</button>
<button onclick="p3.eat();">吃3</button>

<h2>JS 回调</h2>
<input type="number">
<select>
    <option>+</option>
    <option>-</option>
    <option>*</option>
    <option>/</option>
</select>
<input type="number">
<button onclick="clk()">=</button>
<span id="res"></span>


<script>
    function op1(a,b){
        return a + b;
    }
    function op2(a,b){
        return a - b;
    }
    function op3(a,b){
        return a * b;
    }
    function op4(a,b){
        return a / b;
    }

    //  fn 函数对象 ==> 回调函数
    function op( a, b, fn){
        var res = fn(a,b);
        var resElement = document.getElementById("res");
        resElement.innerText = res;
    }

    function clk(){
        // document.querySelector() 找第一个元素
        var inputs = document.querySelectorAll("input");
        var a = inputs[0].value;
        var b = inputs[1].value;

        var select = document.querySelector("select");
        var index = select.selectedIndex;   // 0 - 3
        index ++;

        var fname = "op" + index;

        // var fn = op1
        eval("var fn = " + fname + ";");

        a = parseInt(a);
        b = parseInt(b);

        op(a, b, fn);
    }
</script>

</body>
</html>